import React, { Component } from 'react';
import Chart from '../Dashboard/chart/Chart';
import AddCommodity from '../Dashboard/addCommodity/AddCommodity'
import Swiper from '../homes/swiper/Swiper';
import Hot from '../homes/hot/Hot';
import New from '../homes/new/New'
import Recommend from '../homes/recommend/Recommend'
import Class from '../modules/class/Class'
import Manage from '../modules/manage/Mange'
import Member from '../modules/member/Member'
import Order from '../modules/order/Order'
import Password from '../password/Password'
import './Page.less';
import { Route, Switch, withRouter } from 'react-router-dom'
import { Layout, Menu} from 'antd';
import Home from '../Home/Home';
const { Header, Sider, Content } = Layout;
const { SubMenu } = Menu;
// 引入路由模块

class Page extends Component {
	handleClick({ key }) {
		this.props.history.push(key)
	}
	render() {
		return (
			<div className="iu_home">
				<Layout>
					<Sider style={{ backgroundColor: '#fff', }}>
						<h1 className="logo">电商后台管理系统</h1>
						<Menu
							onClick={e => this.handleClick(e)}
							defaultSelectedKeys={['1']}
							defaultOpenKeys={['sub1']}
							mode="inline"
						>
							<SubMenu key="Dashboard"  title="Dashboard">
								<Menu.Item key="/Dashboard/chart">Dashboard</Menu.Item>
								<Menu.Item key="/Dashboard/addCommodity/1">添加商品</Menu.Item>
							</SubMenu>
							<SubMenu key="sub2"  title="首页模块">
								<Menu.Item key="/">仪表盘</Menu.Item>
								<Menu.Item key="/home/swiper/1">轮播图配置</Menu.Item>
								<Menu.Item key="/home/hot/1">热销商品配置</Menu.Item>
								<Menu.Item key="/home/new/1">新品上线配置</Menu.Item>
								<Menu.Item key="/home/recommend/1">为你推荐配置</Menu.Item>

							</SubMenu>
							<SubMenu key="sub3" title="模块管理">
								<Menu.Item key="/module/class/1">分类管理</Menu.Item>
								<Menu.Item key="/module/manage/1">商品管理</Menu.Item>
								<Menu.Item key="/module/member/1">会员管理</Menu.Item>
								<Menu.Item key="/module/order/1">订单管理</Menu.Item>
							</SubMenu>
							<SubMenu key="sub4"  title="系统管理">
								<Menu.Item key="/system/password">修改密码</Menu.Item>
							</SubMenu>
						</Menu>
					</Sider>
					<Layout>
						<Header style={{ backgroundColor: '#fff'}}></Header>
						<Content style={{backgroundColor: '#f0f2f5'}}>
							<Switch>
								<Route path="/Dashboard/chart" component={Chart}></Route>
								<Route path="/Dashboard/addCommodity/:id"  component={AddCommodity}></Route>
								<Route path="/home/swiper/:id" component={Swiper}></Route>
								<Route path="/home/hot/:id" component={Hot}></Route>
								<Route path="/home/new/:id" component={New}></Route>
								<Route path="/home/recommend/:id" component={Recommend}></Route>
								<Route path="/module/class/:id" component={Class}></Route>
								<Route path="/module/manage/:id" component={Manage}></Route>
								<Route path="/module/member/:id" component={Member}></Route>
								<Route path="/module/order/:id" component={Order}></Route>
								<Route path="/system/password" component={Password}></Route>
								<Route path="*" component={Home}></Route>
							</Switch>
						</Content>
					</Layout>
				</Layout>
			</div>
		)
	}
	
}
let RouterPage = withRouter(Page)
export default RouterPage;
